<!DOCTYPE html>
<!--suppress ThymeleafVariablesResolveInspection -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>预约审核页面</title>
  <link rel="stylesheet" th:href="@{../static/css/component.css}">
  <link rel="stylesheet" th:href="@{../static/css/admin.css}">
  <link rel="stylesheet" th:href="@{../static/css/font-awesome.min.css}">
  <script th:src="@{../static/js/JQuery2.1.4.js}"></script>
  <script th:src="@{../static/js/common.js}"></script>
  <script th:src="@{../static/js/vue.2.6.js}"></script>
  <!-- Bootstrap core CSS -->
  <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="rbody" id="audit">
  <div class="top">
    当前位置：后台<i class="fa fa-fw fa-angle-right"></i>预约审核
  </div>
  <div class="main">
    <div class="container-fluid">
      <div class="col-sm-12" id="right">
        <div class="panel panel-default">
          <div class="panel-heading">
            搜索
          </div>
          <div class="panel-body">
            <form role="form">
              <div  class="form-inline">
                <div class="form-group">
                  <label>楼层</label>
                  <select class="form-control" v-model="placestorey">
                    <option>一楼</option>
                    <option>二楼</option>
                    <option>三楼</option>
                  </select>
                </div>
                <div class="form-group">
                  <label>场地类型</label>
                  <select class="form-control" v-model="placetype">
                    <option>篮球场</option>
                    <option>羽毛球场</option>
                    <option>乒乓球场</option>
                    <option>台球场</option>
                  </select>
                </div>
                <div class="form-group">
                  <button type="button" @click="researchAudits(1)" class="btn btn-default">开始筛选</button>
                </div>
              </div>
            </form>
          </div>
        </div>

        <div class="table-responsive">
          <a data-toggle="modal" data-target="#myModal" style="float: right;font-size: 20px"><i class="fa fa-plus" aria-hidden="true"></i>失约处理</a>
          <table class="table table-striped ">
            <thead>
            <tr>
              <th>预约单号</th>
              <th>一卡通号</th>
              <th>场地编号</th>
              <th>场地楼层及类型</th>
              <th>预约时间</th>
              <th>准确时间段</th>
              <th>操作</th>
            </tr>
            </thead>
            <tbody>
                  <tr v-for="(placeapply,index) in audits">
                    <td>{{placeapply.apply_id}}</td>
                    <td>{{placeapply.user_id}}</td>
                    <td>{{placeapply.place_no}}</td>
                    <td>{{placeapply.place_storey}}/{{placeapply.place_type}}</td>
                    <td>{{placeapply.apply_date  | formatDate }}</td>
                    <td>{{placeapply.apply_period}}</td>
                    <td>
                      <div class="btn-group">
                        <a @click="auditPlace(index,'待使用')" style="font-size: 16px"><i class="fa fa-check" aria-hidden="true"></i>审核通过</a>
                        &nbsp;&nbsp;<a @click="auditPlace(index,'审核不通过')" style="font-size: 16px"><i class="fa fa-times" aria-hidden="true"></i>审核不通过</a>
                      </div>
                    </td>
                  </tr>
            </tbody>
          </table>
        </div>

        <!--场地-->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
          <div class="modal-dialog" style="width: 80%">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-hidden="true">×
                </button>
                <h4 class="modal-title" id="myModalLabel">
                  失约处理
                </h4>
              </div>
              <div class="modal-body">
                <div>
                  <div>
                    <div class="container-fluid">
                      <div class="col-sm-12" id="right1">
                        <div class="table-responsive">
                          <table class="table table-striped ">
                            <thead>
                              <tr>
                                <th>场地编号</th>
                                <th>场地所属楼层</th>
                                <th>场地类型</th>
                                <th>预约日期</th>
                                <th>状态</th>
                                <th>操作</th>
                              </tr>
                            </thead>
                            <tbody v-for='(placeapply,index) in dissmiss' id="msgtable">
                              <tr>
                                <td>{{placeapply.place_no}}</td>
                                <td>{{placeapply.place_storey}}</td>
                                <td>{{placeapply.place_type}}</td>
                                <td>{{placeapply.apply_date | formatDate}}</td>
                                <td>{{placeapply.apply_state}}</td>
                                <td>
                                  <div class="btn-group"><a @click="dealDissMiss(placeapply.apply_id,index)" style="font-size: 16px"><i class="fa fa-times" aria-hidden="true"></i>处理</a></div>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>

              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default"
                        data-dismiss="modal">关闭
                </button>
              </div>
            </div><!-- /.modal-content -->
          </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->

        <ul class="pagination">
          <li v-if="show == '11'">
            <a @click="getAudits(page.prePage)">&laquo;</a>
          </li>
          <li v-if="show == '22'">
            <a @click="researchAudits(page.prePage)">&laquo;</a>
          </li>
          <li v-for="index in page.pages" :class="(page.pageNum == index) ? 'active' : '' ">
            <a><span>{{index}}</span></a>
          </li>
          <li v-if="show == '11'">
            <a @click="getAudits(page.nextPage)">&raquo;</a>
          </li>
          <li v-if="show == '22'">
            <a @click="researchAudits(page.nextPage)">&raquo;</a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>
<script th:src="@{../static/js/placeaudit.js}"></script>
</body>
</html>